<!DOCTYPE html>
<html xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <meta name="description" content="A fully featured admin theme which can be used to build CRM, CMS, etc.">
    <meta name="author" content="Coderthemes">
	<link rel="icon" type="image/x-icon" href="/static/img/favicon.ico">

    <title>BI</title>

    <link href="/static/plugins/bootstrap/4/css/bootstrap.min.css" rel="stylesheet" type="text/css">
    <!--bootstrap-table-->
    <link href="/static/plugins/bootstrap/extends/bootstrap-table-4/bootstrap-table.min.css" rel="stylesheet" type="text/css">
    <!--bootstrap-table-sticky-header-->
    <link href="/static/plugins/bootstrap/extensions/sticky-header/bootstrap-table-sticky-header.css" rel="stylesheet" type="text/css">


	<!-- jQuery  -->
	<script src="/static/plugins/jquery/jquery-3.6.0.min.js"></script>
	<script src="/static/plugins/bootstrap/4/js/bootstrap.min.js"></script>
	
	
	<!--bootstrap-table-->
	<script src="/static/plugins/bootstrap/extends/bootstrap-table-4/bootstrap-table.min.js"></script>
	<script src="/static/plugins/bootstrap/extends/bootstrap-table-4/locale/bootstrap-table-zh-CN.min.js"></script>
	<!--bootstrap-table-sticky-header-->
	<script src="/static/plugins/bootstrap/extensions/sticky-header/bootstrap-table-sticky-header.js"></script>
	
	<script src="/static/plugins/echarts/echarts.min.js"></script>

    <!-- layui -->
	<link rel="stylesheet" href="/static/plugins/layui/2.7.6/css/layui.css" media="all" />
	<script src="/static/plugins/layui/2.7.6/layui.js" charset="utf-8"></script>
	
	<!-- layui-xm-select -->
	<script src="/static/plugins/xm-select/xm-select.js" charset="utf-8"></script>
	
	<!-- echarts -->
	<script src="/static/plugins/echarts/5.4.3/echarts.min.js"></script>
	<!-- echarts自定义 -->
	<script src="/static/js/bi/index/echarts-YJQS.js"></script>
	<script src="/static/js/bi/index/echarts-KCZT.js"></script>
	<script src="/static/js/bi/index/echarts-GGZBDB.js"></script>
	<script src="/static/js/bi/index/echarts-GGSL.js"></script>

	<style>
		.layui-body{left: 0;}
		.layui-layout-admin .layui-header{background: #288892;}
		.layui-header{padding: 12px;}
		.layui-btn-primary{background-color: #ffffff;}
		
		.float-right{float: right;}
	
		.card-body{padding: 0.25rem;}
		.font-title{font-size: 18px; font-weight: bold;}
		.font-title-sub{font-size: 12px; color: gray; position: relative; margin-left: 20px;}
		.font-title-sub2{font-size: 12px; color: gray; text-align: right; padding-right: 20px; position:relative; height: 24px; line-height: 24px; bottom: -5px;}
		
		.font-yesterday{font-size: 16px; font-weight: bold; color: #288892;}
		.font-before{font-size: 12px;}
		.font-clock{font-weight: bold; color: black;}
		
		.ggzbdb-row {margin: 10px;}
		.ggzbdb-table{width: 90%;}
		.ggzbdb-table tr{height: 40px;}
		.ggzbdb-table tr td:nth-child(2){text-align: right;}
		.ggzbdb-table tr td:nth-child(3){text-align: left;}
		.progress-bar-left {
			float: right;
			max-width: 100%;
			height: 18px;
			padding-left: 5px;
			border-top-left-radius: 10px;
			border-bottom-left-radius: 10px;
			text-align: left;
			color: #ffffff;
			background-color: #51c7d7;
			transition: all .3s;
			-webkit-transition: all .3s;
		}
		.progress-bar-right {
			float: left;
			max-width: 100%;
			height: 18px;
			padding-right: 5px;
			border-top-right-radius: 10px;
			border-bottom-right-radius: 10px;
			text-align: right;
			color: #ffffff;
			background-color: #ea707e;
			transition: all .3s;
			-webkit-transition: all .3s;
		}
		
		.hr-white{
			height: 0;
			line-height: 0;
			margin: 10px 0;
			padding: 0;
			border: none!important;
			clear: both;
			overflow: hidden;
			background: 0 0
		}
		
		.t-left{text-align: left;}
		.t-right{text-align: right;}
		
		.mr-2 {padding: 10px;}
		.module-title {padding-left: 30px;}
		.font-color-green{color: #00CD66;}
		.font-color-red{color: red;}
		.table-header{background-color: gray; color: #288892;}
		
		th{border-color: #EEEEEE; background-color: #B0E2FF; padding: 2px;}
		td{border-color: #EEEEEE; padding: 2px 5px; white-space:nowrap; overflow:hidden;text-overflow:ellipsis;}
		
		.btn-selected {background-color: #288892; color: #ffffff !important; border: 0;}
	</style>
</head>

<body>
<div class="layui-layout layui-layout-admin">

	<!-- 顶部悬浮框 -->
	<div class="layui-header">
		<div class="row">
			<div class="col-xl-7 col-md-7">
				<form class="layui-form" id="formId" method="post">
					<div class="layui-form-item">
					  <div class="layui-inline layui-col-xs2">
					    <div id="id_form_region"></div>
					  </div>
					  <div class="layui-inline layui-col-xs2">
					    <div id="id_form_operateOrg"></div>
					  </div>
					  <div class="layui-inline layui-col-xs2">
					    <div id="id_form_operateCompany"></div>
					  </div>
					  <div class="layui-inline layui-col-xs2">
					    <div id="id_form_operateUser"></div>
					  </div>
					  <div class="layui-inline layui-col-xs2">
					    <div id="id_form_shop"></div>
					  </div>
					  <div class="layui-inline layui-col-xs1">
					  	<div>
					    	<button type="button" class="layui-btn layui-btn-primary" onclick="loadAll();">查询</button>
					  	</div>
					  </div>
					</div>
				</form>
			</div>
			<div class="col-xl-5 col-md-5">
				<div class="row">
					<div class="col-xl-12 col-md-12" style="text-align: right;">
						<button type="button" class="layui-btn layui-btn-sm layui-btn-primary">北京 <span class="font-clock" id="id_clock_beijing">-----</span></button>
						<button type="button" class="layui-btn layui-btn-sm layui-btn-primary">英站 <span class="font-clock" id="id_clock_ouzhan">-----</span></button>
						<button type="button" class="layui-btn layui-btn-sm layui-btn-primary">美站 <span class="font-clock" id="id_clock_meizhan">-----</span></button>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	
	<!-- 中间内容 -->
	<div class="layui-body">
	  <!-- Begin Page Content -->
	  <div class="container-fluid">
		
	    <!-- Content Row -->
	    <div class="row">
	      
	      <!-- 店铺销售 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			店铺销售
		              		</span>
		              		<span class="font-title-sub">
		              			昨日
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right;">
							<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadDPXX(0,this);">昨日</button>
							<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-right: 10px;" onclick="loadDPXX(1,this);">近30天</button>
							<span class="font-title-sub2" id="id_dpxx_latestupdatetime">更新截止：--</span>
	              		</div>
	              	</div>
	                <hr class="hr-white">
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table style="width: 100%; text-align: center;" id="id_dpxx_table">
		                		<tr height="25" class="font-before">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                		<tr height="25" class="font-before">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 店铺广告 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			店铺广告
		              		</span>
		              		<span class="font-title-sub">
		              			昨日
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right;">
							<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadDPGG(0,this);">昨日</button>
							<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" style="margin-right: 10px;" onclick="loadDPGG(1,this);">近30天</button>
							<span class="font-title-sub2" id="id_dpgg_latestupdatetime">更新截止：--</span>
	              		</div>
	              	</div>
	                <hr class="hr-white">
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table style="width: 100%; text-align: center;" id="id_dpgg_table">
		                		<tr height="25" class="font-before">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                		<tr height="25" class="font-before">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 业绩趋势 -->
	      <div class="col-xl-12 col-md-12 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			业绩趋势
		              		</span>
		              		<span class="font-title-sub">
		              			近7天
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right;">
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-border-black btn-selected" onclick="loadYJQS(1, this);">销售业绩图</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-border-black" onclick="loadYJQS(2, this);">广告业绩图</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-sm layui-border-black" onclick="loadYJQS(3, this);">广告效果图</button>
	              		</div>
	              	</div>
	                <hr class="hr-white">
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<div style="display: flex;justify-content: space-between;" id="idYJQSView">
								<div id="idYJQS" style="width: 100%;height:300px;"></div>
							</div>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 普品TOP10 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			普品TOP10
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right; margin-bottom: 5px;">
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadTopProduct('id_top_normal_table', 1, 1, this);">昨日</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_normal_table', 1, 2, this);">近7天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_normal_table', 1, 3, this);">近30天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_normal_table', 1, 4, this);">前30天</button>
	              		</div>
	              	</div>
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table border="1" style="width: 100%; text-align: center;" id="id_top_normal_table">
		                		<tr height="25">
		                			<th width="8%;">--</th>
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                		</tr>
		                		<tr height="25" class="font-today">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 精品TOP10 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			精品销售TOP10
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right; margin-bottom: 5px;">
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadTopProduct('id_top_jingpin_table', 2, 1, this);">昨日</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_jingpin_table', 2, 2, this);">近7天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_jingpin_table', 2, 3, this);">近30天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProduct('id_top_jingpin_table', 2, 4, this);">前30天</button>
	              		</div>
	              	</div>
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table border="1" style="width: 100%; text-align: center;" id="id_top_jingpin_table">
		                		<tr height="25">
		                			<th>排名</th>
		                			<th>商品编码</th>
		                			<th>商品名称</th>
		                			<th>店铺</th>
		                			<th>FNSKU</th>
		                			<th>销售数量</th>
		                			<th>销售金额</th>
		                		</tr>
		                		<tr height="25" class="font-today">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 店铺TOP10 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			店铺TOP10
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right; margin-bottom: 5px;">
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadTopShop(1, this);">昨日</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopShop(2, this);">近7天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopShop(3, this);">近30天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopShop(4, this);">前30天</button>
	              		</div>
	              	</div>
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table border="1" style="width: 100%; text-align: center;" id="id_top_shop_table">
		                		<tr height="25">
		                			<th>排名</th>
		                			<th>店铺</th>
		                			<th>运营人</th>
		                			<th>销售数量</th>
		                			<th>销售金额</th>
									<th>公司排名</th>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
		                			<td>--</td>
									<td>--</td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 品类TOP10 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			精品TOP10
		              		</span>
	              		</div>
	              		<div class="col-xl-9 col-md-9" style="text-align: right; margin-bottom: 5px;">
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadTopProductAdvert(1, this,0);">昨日</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(2, this,0);">近7天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(3, this,0);">近30天</button>
	              			<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(4, this,0);">前30天</button>
	              		</div>
	              	</div>
	                <div class="row">
	                	<div class="col-xl-12 col-md-12">
		                	<table border="1" style="width: 100%; text-align: center;" id="id_top_product_advert_table">
		                		<tr height="25">
		                			<th>排名</th>
		                			<th>商品编码</th>
		                			<th>商品名称</th>
		                			<th>销售数量</th>
		                			<th>广告数量</th>
									<th>广告占比</th>
		                			<th>销售金额</th>
		                			<th>广告金额</th>
		                			<th>CPC</th>
		                			<th>TACOS</th>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
									<td></td>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
									<td></td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>

			<!-- 精品广告TOP10 -->
			<div class="col-xl-6 col-md-6 mb-4">
				<div class="card border-left-success shadow h-100">
					<div class="card-body">
						<div class="row no-gutters align-items-center">
							<div class="col mr-2">
								<div class="row">
									<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			精品广告TOP10
		              		</span>
									</div>
									<div class="col-xl-9 col-md-9" style="text-align: right; margin-bottom: 5px;">
										<button type="button" class="layui-btn layui-btn-primary layui-btn-xs btn-selected" onclick="loadTopProductAdvert(1, this ,1);">昨日</button>
										<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(2, this,1);">近7天</button>
										<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(3, this,1);">近30天</button>
										<button type="button" class="layui-btn layui-btn-primary layui-btn-xs" onclick="loadTopProductAdvert(4, this,1);">前30天</button>
									</div>
								</div>
								<div class="row">
									<div class="col-xl-12 col-md-12">
										<table border="1" style="width: 100%; text-align: center;" id="id_top_product_advert_table_by_advert_desc">
											<tr height="25">
												<th>排名</th>
												<th>商品编码</th>
												<th>商品名称</th>
												<th>广告金额</th>
												<th>广告数量</th>
												<th>销售数量</th>
												<th>广告占比</th>
												<th>销售金额</th>
												<th>CPC</th>
												<th>TACOS</th>
											</tr>
											<tr height="25" class="font-yesterday">
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
											<tr height="25" class="font-yesterday">
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
												<td></td>
											</tr>
										</table>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>


	      <!-- 库存状态 -->
	      <div class="col-xl-12 col-md-12 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			库存状态
		              		</span>
		              		<span class="font-title-sub">
		              			昨日
		              		</span>
	              		</div>
	              	</div>
	                <hr class="hr-white">
	                <div class="row">
	                	<div class="col-xl-8 col-md-8">
		                	<div style="display: flex;justify-content: space-between;"  id="idKCZTView">
								<div id="idKCZT" style="width: 100%;height:300px;"></div>
							</div>
	                	</div>
	                	<div class="col-xl-4 col-md-4">
		                	<table border="1" style="width: 100%; text-align: center;" id="id_kczt_table">
		                		<tr height="25">
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                			<th>--</th>
		                		</tr>
		                		<tr height="25" class="font-yesterday">
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                			<td></td>
		                		</tr>
		                	</table>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 广告指标对比 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	              	<div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			广告指标对比
		              		</span>
	              		</div>
	              	</div>
	                <div class="row">
	              		<div class="col-xl-12 col-md-12">
		                	<table class="ggzbdb-table" id="id_ggzbdb_table">
		                		<tr style="text-align: center;">
		                			<td width="30%;"></td>
		                			<td style="text-align: center;">近七天</td>
		                			<td style="text-align: center;">前七天</td>
		                		</tr>
		                		<tr>
		                			<td>广告花费</td>
		                			<td style="text-align: right;"><div class="progress-bar-left" style="width: 30%;">--</div></td>
		                			<td><div class="progress-bar-right" style="width: 70%;">--</div></td>
		                		</tr>
		                		<tr>
		                			<td>广告销售额</td>
		                			<td><div class="progress-bar-left">--</div></td>
		                			<td><div class="progress-bar-right">--</div></td>
		                		</tr>
		                		<tr>
		                			<td>广告销售数量</td>
		                			<td><div class="progress-bar-left">--</div></td>
		                			<td><div class="progress-bar-right">--</div></td>
		                		</tr>
		                		<tr>
		                			<td>点击量</td>
		                			<td><div class="progress-bar-left">--</div></td>
		                			<td><div class="progress-bar-right">--</div></td>
		                		</tr>
		                		<tr>
		                			<td>ACOS</td>
		                			<td><div class="progress-bar-left">--</div></td>
		                			<td><div class="progress-bar-right">--</div></td>
		                		</tr>
		                		<tr>
		                			<td>CPC</td>
		                			<td><div class="progress-bar-left">--</div></td>
		                			<td><div class="progress-bar-right">--</div></td>
		                		</tr>
		                	</table>
	              		</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	      <!-- 广告沙漏 -->
	      <div class="col-xl-6 col-md-6 mb-4">
	        <div class="card border-left-success shadow h-100">
	          <div class="card-body">
	            <div class="row no-gutters align-items-center">
	              <div class="col mr-2">
	                <div class="row">
	              		<div class="col-xl-3 col-md-3 module-title">
		              		<span class="font-title">
		              			广告陀螺
		              		</span>
	              		</div>
	                	<div class="col-xl-12 col-md-12">
		                	<table style="width: 100%; text-align: center;">
		                		<tr>
		                			<td>近7天</td>
		                			<td>上7天</td>
		                		</tr>
		                	</table>
	                	</div>
	                	<div class="col-xl-12 col-md-12">
		                	<div style="display: flex;justify-content: space-between;" id="idGGSLView">
								<div id="idGGSL" style="width: 100%;height:300px;"></div>
							</div>
	                	</div>
	                </div>
	              </div>
	            </div>
	          </div>
	        </div>
	      </div>
	      
	    </div>
	
	  </div>
	  <!-- /.container-fluid -->
	</div>
</div>

<script th:inline="javascript">
var conditions = {};

var selector_region = xmSelect.render({
	el: '#id_form_region',
	tips: '区域',
	data: $.parseJSON(JSON.stringify([[${dto.regionArr}]])),
	toolbar: {
		show: true,
		showIcon: false, // 隐藏图标
		list: [ 'ALL', 'CLEAR']
	},
	on: function(data){
		var arr = [];
		for (var i = 0; i < data.arr.length; i++) {
			var single = data.arr[i];
			arr.push({name: single.name, value: single.value});
		}
		conditions.region = JSON.stringify(arr);
		clearFormShop();
	}
})
var selector_operateOrg = xmSelect.render({
	el: '#id_form_operateOrg', 
	tips: '运营机构',
	paging: true,
	pageSize: 100,
	filterable: true,
	toolbar: {
		show: true,
		showIcon: false, // 隐藏图标
		list: [ 'ALL', 'CLEAR']
	},
	remoteSearch: true,
	pageRemote: true,
	remoteMethod: function(val, cb, show, pageIndex){
        $.post('/web/bi/listOrg?pageNo=' + pageIndex, {
            name: val
        }, function(res){
        	cb(res.data);
        });
	},
	on: function(data){
		var arr = [];
		for (var i = 0; i < data.arr.length; i++) {
			var single = data.arr[i];
			arr.push({name: single.name, value: single.value});
		}
		conditions.org = JSON.stringify(arr);
		clearFormShop();
	}
})
var selector_operateCompany = xmSelect.render({
	el: '#id_form_operateCompany', 
	tips: '运营公司',
	paging: true,
	pageSize: 100,
	filterable: true,
	toolbar: {
		show: true,
		showIcon: false, // 隐藏图标
		list: [ 'ALL', 'CLEAR']
	},
	remoteSearch: true,
	pageRemote: true,
	remoteMethod: function(val, cb, show, pageIndex){
        $.post('/web/bi/listOperateCompany?pageNo=' + pageIndex, {
            name: val
        }, function(res){
        	cb(res.data);
        });
	},
	on: function(data){
		var arr = [];
		for (var i = 0; i < data.arr.length; i++) {
			var single = data.arr[i];
			arr.push({name: single.name, value: single.value});
		}
		conditions.company = JSON.stringify(arr);
		clearFormShop();
	}
})
var selector_operateUser = xmSelect.render({
	el: '#id_form_operateUser', 
	tips: '运营人员',
	paging: true,
	pageSize: 100,
	filterable: true,
	toolbar: {
		show: true,
		showIcon: false, // 隐藏图标
		list: [ 'ALL', 'CLEAR']
	},
	remoteSearch: true,
	pageRemote: true,
	remoteMethod: function(val, cb, show, pageIndex){
        $.post('/web/bi/listOperateUser?pageNo=' + pageIndex, {
            name: val
        }, function(res){
        	cb(res.data);
        });
	},
	on: function(data){
		var arr = [];
		for (var i = 0; i < data.arr.length; i++) {
			var single = data.arr[i];
			arr.push({name: single.name, value: single.value});
		}
		conditions.user = JSON.stringify(arr);
		clearFormShop();
	}
})

var selector_shop = xmSelect.render({
	el: '#id_form_shop', 
	tips: '店铺',
	paging: true,
	pageSize: 100,
	filterable: true,
	toolbar: {
		show: true,
		showIcon: false, // 隐藏图标
		list: [ 'ALL', 'CLEAR']
	},
	remoteSearch: true,
	pageRemote: true,
	remoteMethod: function(val, cb, show, pageIndex){
        $.post('/web/bi/listShop?pageNo=' + pageIndex, {
            name: val
        }, function(res){
        	cb(res.data, 10);
        });
	},
	on: function(data){
		var arr = [];
		for (var i = 0; i < data.arr.length; i++) {
			var single = data.arr[i];
			arr.push({name: single.name, value: single.value});
		}
		conditions.shop = JSON.stringify(arr);
		console.log(conditions);
	}
});

</script>
<script src="/static/js/bi/index/index.js?v=20240228102521"></script>
</body>
</html>